﻿<Window x:Class="StylesDemo"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Styles Demo" Height="217.756" Width="397">
    <Grid>
        <Grid.Resources>

            <Style TargetType="{x:Type TextBlock}" x:Key="textBlockHeading">
                <Setter Property="VerticalAlignment" Value="Center" />
                <Setter Property="Margin" Value="12" />
                <Setter Property="Foreground" Value="SandyBrown" />
                <Setter Property="FontSize" Value="18" />
            </Style>
            <Style TargetType="{x:Type TextBox}">
                <Setter Property="VerticalAlignment" Value="Center" />
                <Setter Property="Foreground" Value="Brown" />
                
                <!-- Uncomment the below to add some row spacing-->
                <!--<Setter Property="Margin" Value="3.5" />-->
            </Style>
            <Style TargetType="{x:Type Label}">
                <Setter Property="HorizontalAlignment" Value="Left" />
                <Setter Property="Margin" Value="20,0,0,0" />
                <Setter Property="VerticalAlignment" Value="Center" />
                <Setter Property="Foreground" Value="DarkGreen" />
            </Style>
            
            <!-- Inherits from the above modified Label style-->
            <!-- If you removed the BasedOn property, what happens?-->
            <!-- If you move the below style above the previous style, what happens?-->
            <Style TargetType="{x:Type Label}" BasedOn="{StaticResource {x:Type Label}}" x:Key="labelSecret">
                <Setter Property="Foreground" Value="Red" />
                <Setter Property="ToolTip" Value="Enter the secret answer you supplied during registeration" />
            </Style>
        </Grid.Resources>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="125" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="10" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        
        <TextBlock Text="Customer" Grid.ColumnSpan="2" Style="{StaticResource textBlockHeading}" />
        
        <Label Grid.Row="1" Content="First Name"/>
        <TextBox Name="TextBox1" Grid.Row="1" Grid.Column="1" />

        <Label Grid.Row="2" Content="Last Name"/>
        <TextBox Name="TextBox2" Grid.Row="2" Grid.Column="1" />
        
        <Label Grid.Row="3" Content="Secret Answer" Style="{StaticResource labelSecret}"/>
        <TextBox Name="TextBox3" Grid.Row="3" Grid.Column="1" />
        
        <Button Grid.Row="4" VerticalAlignment="Center" HorizontalAlignment="Right" Height="24" Name="Button1" Width="75" Grid.Column="1">OK</Button>
    </Grid>
</Window>
